<template>
    <div>
        <Preview></Preview>
        <Password></Password>
        <el-container>
            <el-header>
                <el-menu mode="horizontal">
                    <el-submenu index="1">
                        <template slot="title">文件</template>
                        <el-menu-item index="1-1">
                            <UploadFile></UploadFile>
                        </el-menu-item>
                        <el-menu-item index="1-2">
                            <SaveResult></SaveResult>
                        </el-menu-item>
                    </el-submenu>
                    <el-submenu index="2">
                        <template slot="title">密码</template>
                        <el-menu-item index="2-1">
                            <ChangePassword></ChangePassword>
                        </el-menu-item>
                    </el-submenu>
                    <el-menu-item style="float:right" index="3">
                        <img src="./assets/logo.png">
                    </el-menu-item>
                </el-menu>
            </el-header>
            <el-main>
                <el-collapse v-model="activeCollapseNames">
                    <el-collapse-item title="筛选条件" name="1">
                        <ColumnFilter></ColumnFilter>
                    </el-collapse-item>
                    <el-collapse-item title="查询结果" name="2">
                        <ResultTable></ResultTable>
                    </el-collapse-item>
                </el-collapse>

            </el-main>
        </el-container>
    </div>
</template>

<script>
    import UploadFile from './components/UploadFile'
    import SaveResult from "@/components/SaveResult";
    import ColumnFilter from "@/view/ColumnFilter";
    import ResultTable from "@/view/ResultTable";
    import Password from "@/components/Password";
    import ChangePassword from "@/components/ChangePassword";
    import Preview from "@/components/Preview";

    export default {
        name: 'app',
        components: {
            Preview,
            ChangePassword,
            Password,
            ResultTable, ColumnFilter,
            UploadFile, SaveResult,
        },
        data() {
            return {
                activeCollapseNames: ['1', '2'],
            };
        },
        computed: {},
        methods: {}
    }
</script>

<style>
    /*.el-table .system-row {*/
    /*    background: #B2DFDB;*/
    /*}*/

    /*.el-table .module-row {*/
    /*    background: rgba(178, 223, 219, 0.25);*/
    /*}*/

    /*.el-table .item-row-striped {*/
    /*    background: #EFEFEF;*/
    /*}*/

    /*.el-table--enable-row-hover .el-table__body tr:hover > td {*/
    /*    background-color: #e3fbb5 !important;*/
    /*    !*color: #212121 !important;*!*/
    /*}*/

    /* long button */
    .el-button.long {
        width: 100%;
        text-align: center;
    }

    /* long upload button */
    .long .el-upload {
        width: 100%;
    }

    /*  menu-item float-right  */
    li.el-menu-item.right {
        float: right;
    }

    /* collapse */
    .el-collapse-item__header {
        background: #eeeeee;
        padding-left: 10px;
    }
</style>
